;(function () {
	// 步骤3：创建echarts实例
	let myChart = echarts.init(document.querySelector('.mid>.item2'))

	// 步骤4：定义配置（指定图表的配置项和数据）
	let option = {
		legend: {
			top: 20,
			data: ['图例1', '图例2', '完成率'],
			textStyle: {
				color: '#fff',
			},
		},
		xAxis: [
			{
				axisTick: { show: false },
				type: 'category',
				data: [
					'1月',
					'2月',
					'3月',
					'4月',
					'5月',
					'6月',
					'7月',
					'8月',
					'9月',
					'10月',
					'11月',
					'12月',
				],
			},
		],
		grid: {
			bottom: 20,
		},
		yAxis: [
			{
				type: 'value',
				name: '金额',
				max: 50,
				min: 0,
				axisLine: { show: true },
				axisTick: { show: true },
				splitLine: { show: false },
			},
			{
				type: 'value',
				name: '完成率',
				max: 100,
				min: 0,
				axisLine: { show: true },
				splitLine: { show: false },
			},
		],
		title: {
			text: '标题样式',
			textStyle: {
				color: '#fff',
			},
			left: 0,
			top: 0,
		},
		tooltip: {
			show: true,
			trigger: 'axis',
			axisPointer: {
				type: 'line',
				axis: 'x',
			},
		},
		series: [
			{
				name: '图例1',
				type: 'bar',
				data: [4, 6, 36, 6, 8, 6, 4, 6, 30, 40, 80, 20],
			},
			{
				name: '图例2',
				type: 'bar',
				data: [4, 2, 34, 6, 8, 6, 4, 2, 32, 40, 9, 22],
				barGap: 0,
			},
			{
				name: '完成率',
				type: 'line',

				data: [50, 20, 40, 15, 3, 45, 20, 12, 22, 31, 11, 13],

				smooth: true,
			},
		],
	}

	// 步骤5：使用刚指定的配置项和数据显示图表
	myChart.setOption(option)

	// window.onresize = () => {
	//     myChart.resize()
	// }

	window.addEventListener('resize', () => {
		myChart.resize()
	})
})()
